<template>
  <div class="app-container">
    <el-form ref="form" :model="form" :rules="rules" label-width="120px">
      <el-row>
        <el-col :span="8">
          <el-form-item label="检验单编号" prop="osqcCode">
            <el-input v-model="form.osqcCode" placeholder="请输入外协检验单编号" readonly/>
          </el-form-item>
        </el-col>

        <el-col :span="9">
          <el-form-item label="检验单名称" prop="osqcName">
            <el-input v-model="form.osqcName" placeholder="请输入内容"/>
          </el-form-item>
        </el-col>
        <el-col :span="3" align="middle">
          <el-image fit="contain" v-if="form.checkResult == 'ACCEPT'" :src="acceptImg"/>
          <el-image fit="contain" v-else-if="form.checkResult == 'REJECT'" :src="rejectImg"/>
          <el-image fit="contain" v-else :src="prepareImg"/>
        </el-col>
      </el-row>
      <el-divider content-position="center">产品与生产商</el-divider>
      <el-row>
        <el-col :span="8">
          <el-form-item label="外协工单号" v-if="form.sourceDocType=='整单外协'"prop="sourceDocCode">
            <el-input v-model="form.sourceDocCode" readonly >
            </el-input>
          </el-form-item>
          <el-form-item label="外协订单号" v-if="form.sourceDocType=='工序外协'" prop="sourceDocCode">
            <el-input v-model="form.sourceDocCode" readonly >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="工序编码" v-if="form.sourceDocType=='工序外协'"prop="taskCode">
            <el-input v-model="form.taskCode" readonly >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="工序名称" v-if="form.sourceDocType=='工序外协'"prop="taskName">
            <el-input v-model="form.taskName" readonly >
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="产品物料编码" prop="itemCode">
            <el-input v-model="form.itemCode" readonly >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="产品物料名称" prop="itemName">
            <el-input v-model="form.itemName" readonly="readonly"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="单位" prop="unitOfMeasure">
            <el-input v-model="form.unitOfMeasure" readonly="readonly"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="生产商编码" prop="manufactureCode">
            <el-input v-model="form.manufactureCode" readonly />
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="生产商名称" prop="manufactureName">
            <el-input v-model="form.manufactureName" readonly="readonly"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="批次号" prop="manufactureBatch">
            <el-input v-model="form.manufactureBatch" readonly/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-divider content-position="center">检测情况</el-divider>
      <el-row>
        <el-col :span="8">
          <el-form-item label="本次接收数量" prop="quantityRecived">
            <el-input v-model="form.quantityRecived" readonly/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="本次检测数量" prop="quantityCheck">
            <el-input-number :min="1" :max="Number(form.quantityRecived)" v-model="form.quantityCheck" placeholder="请输入本次检测数量"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="不合格数量" prop="quantityUnqualified">
            <el-input-number :min="0"  :max="form.quantityCheck" v-model="form.quantityUnqualified" placeholder="请输入不合格数"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="到货日期" prop="reciveDate">
            <el-date-picker clearable
                            v-model="form.reciveDate"
                            type="date"
                            value-format="yyyy-MM-dd"
                            placeholder="请选择到货日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="检测日期" prop="inspectDate">
            <el-date-picker clearable
                            v-model="form.inspectDate"
                            type="date"
                            value-format="yyyy-MM-dd"
                            placeholder="请选择检测日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="检测结果" prop="checkResult">
            <el-select v-model="form.checkResult" placeholder="请选择检测结果">
              <el-option
                v-for="dict in dict.type.mes_qc_result"
                :key="dict.value"
                v-if="dict.value!='EXEMPT'"
                :label="dict.label"
                :value="dict.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="检测人员" prop="inspector">
            <el-input v-model="form.inspector" placeholder="请输入检测人员" readonly>
              <el-button slot="append" @click="handleSelectUser" icon="el-icon-search"></el-button>
            </el-input>
            <UserSelect ref="userSelect" @onSelected="onUserSelected" ></UserSelect>
          </el-form-item>
        </el-col>
        <el-col :span="16">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-divider content-position="center">统计结果</el-divider>
        <el-row>
          <el-col :span="8">
            <el-form-item label="致命缺陷率" prop="crRate">
              <el-input v-model="form.crRate" readonly="readonly"/>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="严重缺陷率" prop="majRate">
              <el-input v-model="form.majRate" readonly="readonly"/>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="轻微缺陷率" prop="minRate">
              <el-input v-model="form.minRate" readonly="readonly"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="致命缺陷数量" prop="crQuantity">
              <el-input v-model="form.crQuantity" readonly="readonly"/>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="严重缺陷数量" prop="majQuantity">
              <el-input v-model="form.majQuantity" readonly="readonly"/>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="轻微缺陷数量" prop="minQuantity">
              <el-input v-model="form.minQuantity" readonly="readonly"/>
            </el-form-item>
          </el-col>
        </el-row>
      <el-divider v-if="form.osqcId ==null||form.status=='PREPARE'" content-position="center">图纸</el-divider>
      <el-table v-if="form.osqcId ==null||form.status=='PREPARE'" :data="routeProcessDrawingList">
        <el-table-column label="图纸名称" align="center" prop="lineName">
          <template slot-scope="scope">
            <el-link :href="scope.row.lineUrl" :underline="false" target="_blank">
              <span class="el-icon-document"> {{scope.row.lineName}}</span>
            </el-link>
          </template>
        </el-table-column>
        <el-table-column label="图号" align="center" prop="lineNumber"/>
        <el-table-column label="图纸描述" align="center" prop="remark"/>
      </el-table>
      <el-divider v-if="form.osqcId !=null&&form.sourceDocType=='整单外协'" content-position="center">检测项</el-divider>
      <el-card shadow="always" v-if="form.osqcId !=null&&form.sourceDocType=='整单外协'" class="box-card">
        <OsqcLine ref=line :osqcId="form.osqcId" @handleReview="handleReview"></OsqcLine>
      </el-card>
    </el-form>
    <el-form label-width="100px">
      <el-form-item style="text-align: center;margin-left:-120px;margin-top:30px;">
        <el-button type="primary" @click="cancel" v-if=" form.status !='PREPARE' ">返回</el-button>
        <el-button type="primary" @click="submitForm" v-if="form.status =='PREPARE' ">保 存
        </el-button>
        <el-button type="success" @click="handleFinish"
                   v-if="form.status =='PREPARE' && form.osqcId !=null">完成
        </el-button>
        <el-button @click="cancel">取 消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { getOsqc,  addOsqc, updateOsqc,getOsqcBySource} from "@/api/mes/qc/osqc";
import { getDrawingListByQcId} from "@/api/mes/pro/outsourcingorder";
import {getOutsourcefeedbackDrawing} from "@/api/mes/pro/outsourcefeedback"
import OsqcLine from "../osqc/osqcline.vue";
import {genCode} from "@/api/system/autocode/rule"
import UserSelect from "@/components/userSelect/single.vue";
import { getUserProfile } from "@/api/system/user";
import Template from "@/views/print/printtemplate/list.vue";

export default {
  name: "pendingOsqc",
  components: {Template, OsqcLine, UserSelect },
  dicts: ['mes_qc_result'],
  data() {
    return {
      routeProcessDrawingList:[],
      acceptImg: require('@/assets/images/accept.png'),
      rejectImg: require('@/assets/images/reject.png'),
      prepareImg: require('@/assets/images/prepare.png'),
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        osqcCode: [
          {required: true, message: "请输入或生成检验单编号", trigger: "blur"}
        ],
        quantityRecived: [
          {required: true, message: "本次接收数量不能为空", trigger: "blur"}
        ],
        quantityCheck: [
          {required: true, message: "本次检测数量不能为空", trigger: "blur"}
        ],
        inspectDate: [
          {required: true, message: "检测日期不能为空", trigger: "blur"}
        ],
        checkResult:[
          {required: true, message: "检测结果不能为空", trigger: "blur"}
        ]
      },
      // 当前登录用户
      user: null,
    }
  },
  created() {
    this.reset();
    getOsqcBySource({
      sourceDocId: this.$route.params.sourceDocId,
      sourceDocCode: this.$route.params.sourceDocCode,
      sourceLineId: this.$route.params.sourceLineId
    }).then(response => {

      if(response.data){
        this.form=response.data;
        this.form.quantityRecived=this.$route.params.quantityUncheck;
          if(!this.form.osqcCode){
            genCode('QC_OSQC_CODE').then(response => {
              this.form.osqcCode = response;
            });
          }
      }else{
        this.reset();
        genCode('QC_OSQC_CODE').then(response => {
          this.form.osqcCode = response;
        });
      }
      if(this.form.osqcId ==null||this.form.status=='PREPARE'){
        if(this.form.sourceDocType=='工序外协'){
        getOutsourcefeedbackDrawing(this.$route.params.sourceLineId).then(re=>{
          this.routeProcessDrawingList=re.data;
        })
      }else {
          getDrawingListByQcId(this.$route.params.sourceLineId).then(re => {
            this.routeProcessDrawingList = re.rows;
          });
        }
        }
    })

  },
  methods: {
    // 取消按钮
    cancel() {
      const obj = {path: "/mes/qc/pendinginspect"};
      this.$tab.closeOpenPage(obj);
    },
    handleReview() {
      getOsqc(this.form.osqcId).then(response => {
        this.form.crRate=response.data.crRate;
          this.form.majRate=response.data.majRate;
          this.form.minRate=response.data.minRate;
          this.form.crQuantity=response.data.crQuantity;
          this.form.majQuantity=response.data.majQuantity;
          this.form.minQuantity=response.data.minQuantity;
      });
    },
    // 表单重置
    reset() {
      this.form = {
        osqcId: null,
        osqcCode: null,
        osqcName: null,
        templateId: null,
        taskCode:  this.$route.params.taskCode,
        taskName:  this.$route.params.taskName,
        sourceDocId: this.$route.params.sourceDocId,
        sourceDocType: this.$route.params.sourceDocType,
        sourceDocCode: this.$route.params.sourceDocCode,
        sourceLineId: this.$route.params.sourceLineId,
        manufactureId: this.$route.params.vendorClientId,
        manufactureCode: this.$route.params.vendorClientCode,
        manufactureName: this.$route.params.vendorClientName,
        manufactureNick: this.$route.params.vendorClientNick,
        manufactureBatch: this.$route.params.batchCode,
        itemId: this.$route.params.itemId,
        itemCode: this.$route.params.itemCode,
        itemName: this.$route.params.itemName,
        specification: this.$route.params.specification,
        unitOfMeasure: this.$route.params.unitOfMeasure,
        quantityMinCheck: null,
        quantityMaxUnqualified: null,
        quantityRecived: this.$route.params.quantityUncheck,
        quantityCheck: null,
        quantityUnqualified: null,
        crRate: null,
        majRate: null,
        minRate: null,
        crQuantity: null,
        majQuantity: null,
        minQuantity: null,
        checkResult: null,
        reciveDate: this.$route.params.recordTime,
        inspectDate: null,
        inspector: null,
        status: "PREPARE",
        remark: null,
        attr1: this.$route.params.qcType,
        attr2: null,
        attr3: null,
        attr4: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null
      };
      this.autoGenFlag = false;
      this.resetForm("form");
      this.getUser();
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if(this.form.quantityRecived<this.form.quantityCheck){
            this.$modal.msgError("检测数量不能大于接收数量！");
            return;
          }
          if(this.form.quantityCheck<this.form.quantityUnqualified){
            this.$modal.msgError("不合格数量不能大于检测数量！");
            return;
          }
          if (this.form.osqcId != null) {
            updateOsqc(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
            });
          } else {
            addOsqc(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.form.osqcId = response.data;
            });
          }
        }
      });
    },
    //点击完成
    handleFinish() {
      let that = this;
      if (this.form.checkResult == null) {
        this.$modal.msgError("请选择检测结果！");
        return;
      }
      if(this.form.quantityRecived<this.form.quantityCheck){
        this.$modal.msgError("检测数量不能大于接收数量！");
        return;
      }
      if(this.form.quantityCheck<this.form.quantityUnqualified){
        this.$modal.msgError("不合格数量不能大于检测数量！");
        return;
      }
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.$modal.confirm('是否完成来料检验单编制？【完成后将不能更改】').then(function () {
            that.form.status = 'FINISHED';
            that.submitForm();
            that.cancel();
          });
        }
      });
    },

    handleSelectUser(){
      this.$refs.userSelect.showFlag = true;
    },
    // 用户选择弹出框
    onUserSelected(obj){
      if(obj != undefined && obj != null){
        this.form.inspector = obj.nickName;
      }
    },
    // 获取登录用户
    getUser() {
      getUserProfile().then(response => {
        this.user = response.data;
        this.form.inspector = this.user.nickName;
      });
    },
  }
}


</script>
